Fix SSR support: require opt in & support both simple and advanced SSR cases#40
Conversation
…R cases Disable SSR behaviour entirely unless the new `ssr` option is provided, to fix regression where server-side store changes are ignored on the initial value is always rendered even in projects that don't need SSR support Enable SSR support for simple cases, where the store's initial value is the same on server and client, by setting `ssr:true` Enable SSR support for advanced cases, where server store state is updated on the server then passed to the client, by providing a function that returns the server state: `ssr: () => serverState`. This function is provided to `useSyncExternalStore` as the `getServerSnapshot` option.
|
Hi @ai here is yet another PR, exploring a better approach for supporting SSR and client hydration per nanostores/preact#10 and nanostores/preact#12 This PR should become the priority for SSR work because it fixes a likely regression in the nanostores/react |
jmurty
force-pushed
the
fix-regression-for-ssr
branch
from
14a106f to
d6e48f9
Compare
|
|
||
| <h3>SSR</h3> | ||
|
|
||
| Use the `ssr` option to avoid hydration errors loading server-side rendered (SSR) pages when the browser's client store gets out of sync with the server's HTML. For example, when using Astro with `<ClientRouter />` for client-side routing and a global nanostore. |
There was a problem hiding this comment.
In docs we need to explain the poroblem more. Right now it looks like for SSR use ssr: true.
What is side effect of using ssr: true in wrong context? What is side-effect? In what SSR context user should not use ssr: true?
There was a problem hiding this comment.
Hi @ai thanks for the merge. In a few minutes I'll have (hopefully) improved documentation as well.
There was a problem hiding this comment.
Here is my fix 23f6161
Do you plan to add something more?
2 participants
Disable SSR behaviour entirely unless the new
ssroption is provided, to fix regression where server-side store changes are ignored and the initial value is always rendered even in projects that don't need SSR supportEnable SSR support for simple cases, where the store's initial value is the same on server and client, by setting
ssr:trueEnable SSR support for advanced cases, where server store state is updated on the server then passed to the client, by providing a function that returns the server state:
ssr: () => serverState. This function is provided to React'suseSyncExternalStoreas thegetServerSnapshotoption.